<script setup lang="ts">
import { ref } from 'vue'

const emit = defineEmits(['close'])
const show = ref(false)
defineExpose({
  show,
})
function handleClose() {
  show.value = false
  emit('close')
}
</script>

<template>
  <wd-popup v-model="show" lock-scroll position="bottom" :safe-area-inset-bottom="true" closable custom-style="height: 1060rpx;border-radius: 32rpx 32rpx 0 0;" @close="handleClose">
    <!-- <view class="wot-form-title">
      【 设备＞软件配置 】
    </view> -->
    <view class="px-10% pt-100rpx">
      <wd-row :gutter="20">
        <wd-col :span="8">
          <view class="cols">
            <view>服务费充值</view>
            <view class="num text-#2A90FF">
              530.00
            </view>
          </view>
        </wd-col>
        <wd-col :span="8">
          <view class="cols">
            <view>服务费充值</view>
            <view class="num text-#EE0A24">
              0.00
            </view>
          </view>
        </wd-col>
        <wd-col :span="8">
          <view class="cols">
            <view>服务费充值</view>
            <view class="num text-#07C160">
              -536.68
            </view>
          </view>
        </wd-col>
      </wd-row>

      <view class="fee-list">
        <wd-divider color="#333">
          展示文本
        </wd-divider>
        <view class="fee-item">
          账户余额转入：0.00
        </view>
        <view class="fee-item">
          充值服务费：200.00
        </view>
        <view class="fee-item flex">
          其他商户转入：200.00
        </view>
        <view class="fee-item">
          支付转服务费：0.07
        </view>
      </view>
      <view class="fee-list">
        <wd-divider color="#333">
          已用服务费详情
        </wd-divider>
        <view class="fee-item">
          服务费费率：0.006~0.008
        </view>
        <view class="fee-item">
          支付服务费：0.01 (含内扣)
          <view class="text-#333">
            支付总额：4.04（含退款）  平均费率：0.002
          </view>
        </view>
        <view class="fee-item flex">
          派币服务费：3.68
          <view class="text-#333">
            派币数量：368.40  ( 派一个币，收取0.002服务费 )
          </view>
        </view>
        <view class="fee-item">
          转给其他商户：0.00
        </view>
        <view class="fee-item">
          流量卡充值：0.00
        </view>
      </view>
    </view>
  </wd-popup>
</template>

<style lang="scss" scoped>
.desc{
    padding: 40rpx 20rpx;
    line-height: 40rpx;
    font-size: 24rpx;
    color: #ED6A0C;
}
.cols{
    text-align: center;
    .num{
      font-size: 30rpx;
      padding-top: 5rpx;
    }
}
.fee-list{
    padding: 20rpx;
}
.fee-item{
    padding: 10rpx 0;
    border-bottom: 1rpx dashed #b3b3b3;
    font-size: 24rpx;
    color: #333333;
}
</style>
